import React, { useEffect, useState } from 'react';
import {$getother} from "../../api/mineapi";
import {Button} from "antd";
import {CheckSquareOutlined} from "@ant-design/icons";
import {$CheckFeedBack} from "../../api/FeedBackapi";
import MyNotification from "../../components/MyNotification/MyNotification";
export default function FeedBack({item}){
    //通知框状态
    const [notiMsg, setNotiMsg] = useState({ type: "", description: "" });
    const [data,setData]=useState({});
    const [formattedDateTime1,setFormattedDateTime1]=useState('');
    const getSelfInformation=async ()=>{
        const response = await $getother({ studentId:item.studentId.toString()});
        console.log(response.data);
        setData(response.data);
    }
    useEffect(()=>{
        getSelfInformation();
        // 使用Date对象解析原始日期时间字符串
        const originalDateTime = new Date(item.createdAt);
        // 获取所需的日期时间格式，例如 "YYYY-MM-DDTHH:MM"
        setFormattedDateTime1(originalDateTime.toISOString().slice(0, 16))
    },[])
    const check=async ()=>{
        console.log('abc');
        const response =await $CheckFeedBack({feedbackId:item.feedbackId})
        if (response.code){
            setNotiMsg({ type: "success", description: response.message });
        }else{
            setNotiMsg({ type: "error", description: response.message })
        }
    }
    return(
        <div style={{borderBottom:'4px solid rgb(220, 240, 238)',marginBottom:'20px'}}>
            <div style={{display:'flex',justifyContent:'space-between',marginTop:'20px',marginBottom:'20px'}}>
                <div style={{fontWeight:'bold',fontSize:'20px',marginLeft:'20px'}}>{data.nickname}</div>
                <Button icon={<CheckSquareOutlined/>} style={{
                    backgroundColor: 'rgb(1, 186, 173)',
                    color: 'white',
                    marginRight: '20px',
                    borderRadius: '20px'
                }} onClick={check}>已读</Button>
            </div>

            <div style={{marginLeft:'20px',marginBottom:'20px'}}>{item.content}</div>
            <div style={{marginLeft:'1100px',color:'rgb(208, 208, 208)'}}>{formattedDateTime1}</div>
            <MyNotification notiMsg={notiMsg}/>
        </div>
    )
}